// ElementPlus主题色计算原理参见：node_modules/element-plus/basicColor-chalk/src/common/var.scss
// 以primary为例，颜色由深至浅：
// --el-color-primary-dark-2（由--el-color-primary混合了20%的黑色#ffffff计算得到，以下类推）
// --el-color-primary
// --el-color-primary-light-1（由90%的--el-color-primary混合了10%的白色#ffffff计算得到，以下类推）
// --el-color-primary-light-2
// --el-color-primary-light-3
// --el-color-primary-light-4
// --el-color-primary-light-5
// --el-color-primary-light-6
// --el-color-primary-light-7
// --el-color-primary-light-8
// --el-color-primary-light-9
// 在线混色工具：https://gradients.app/en/mix

import { checkHEX } from '~/utils/common'

/**
 * 混色器
 * @param {*} baseColorHEX  基准色16进制编码（以#开头）
 * @param {*} mixColorHEX   混色16进制编码（以#开头）
 * @param {*} mixWeight     混色权重（0～1）
 */
function colorMixer(baseColorHEX, mixColorHEX, mixWeight) {
  function RGBPraser(hex) {
    const R = parseInt(hex.slice(1, 3), 16)
    const G = parseInt(hex.slice(3, 5), 16)
    const B = parseInt(hex.slice(5, 7), 16)
    return { R, G, B }
  }

  const baseColor = RGBPraser(baseColorHEX)
  const mixColor = RGBPraser(mixColorHEX)
  const mixedColor_R = Math.round((1 - mixWeight) * baseColor.R + mixWeight * mixColor.R)
  const mixedColor_G = Math.round((1 - mixWeight) * baseColor.G + mixWeight * mixColor.G)
  const mixedColor_B = Math.round((1 - mixWeight) * baseColor.B + mixWeight * mixColor.B)
  return `#${mixedColor_R.toString(16).padStart(2, '0')}${mixedColor_G.toString(16).padStart(2, '0')}${mixedColor_B.toString(16).padStart(2, '0')}`
}
const black = '#000000'
const white = '#ffffff'

export function setBasicColor(ComputedSettings, basicColor) {
  function setDocumentProperties(type, color) {
    document.documentElement.style.setProperty(`--el-color-${type}-dark-2`, colorMixer(color, black, 0.2))
    document.documentElement.style.setProperty(`--el-color-${type}`, color)
    for (var i = 1; i < 10; i++) {
      document.documentElement.style.setProperty(`--el-color-${type}-light-${i}`, colorMixer(color, white, i / 10))
    }
  }

  if (basicColor.primary && checkHEX(basicColor.primary)) {
    ComputedSettings.basicColor.primary = basicColor.primary
    setDocumentProperties('primary', basicColor.primary)
  }
  if (basicColor.success && checkHEX(basicColor.success)) {
    ComputedSettings.basicColor.success = basicColor.success
    setDocumentProperties('success', basicColor.success)
  }
  if (basicColor.warning && checkHEX(basicColor.warning)) {
    ComputedSettings.basicColor.warning = basicColor.warning
    setDocumentProperties('warning', basicColor.warning)
  }
  if (basicColor.danger && checkHEX(basicColor.danger)) {
    ComputedSettings.basicColor.danger = basicColor.danger
    setDocumentProperties('danger', basicColor.danger)
  }
  if (basicColor.error && checkHEX(basicColor.error)) {
    ComputedSettings.basicColor.error = basicColor.error
    setDocumentProperties('error', basicColor.error)
  }
  if (basicColor.info && checkHEX(basicColor.info)) {
    ComputedSettings.basicColor.info = basicColor.info
    setDocumentProperties('info', basicColor.info)
  }
  if (basicColor.background && checkHEX(basicColor.background)) {
    ComputedSettings.basicColor.background = basicColor.background
    document.documentElement.style.setProperty(`--el-bg-color-page`, basicColor.background)
  }
}
